<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns:v-on="http://www.w3.org/1999/xhtml">
	<head>
		<title>login</title>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<link rel="stylesheet" type="text/css"
			href="css/style.css" />
	</head>

	<body>
		<div id="wrap">
			<div id="top_content">
					<div id="header">
						<div id="rightheader">
							<p>
								2009/11/20
								<br />
							</p>
						</div>
						<div id="topheader">
							<h1 id="title">
								<a href="#">main</a>
							</h1>
						</div>
						<div id="navigation">
						</div>
					</div>
				<div id="content">
					<p id="whereami">
					</p>
					<h1>
						login
					</h1>
					<form action="emplist.html" method="post">
						<table cellpadding="0" cellspacing="0" border="0"
							class="form_table">
							<tr>
								<td valign="middle" align="right">
									账户名:
								</td>
								<td valign="middle" align="left">
									<input type="text" class="inputgri" v-model="user.username" />
								</td>
							</tr>
							<tr>
								<td valign="middle" align="right">
									密码:
								</td>
								<td valign="middle" align="left">
									<input type="password" class="inputgri" v-model="user.password" />
								</td>
							</tr>
						</table>
						<p>
							<input type="button" class="button" v-on:click="login"   value="登录 &raquo;" />
							&nbsp;&nbsp;
							<a href="/emsvue/regist.html">注册</a>
						</p>
					</form>
				</div>
			</div>
			<div id="footer">
				<div id="footer_bg">
					ABC@126.com
				</div>
			</div>
		</div>
	</body>
</html>
<script src="/emsvue/js/vue.js"></script>
<script src="/emsvue/js/axios.min.js"></script>
<script>
	var app = new Vue({
		el: "#wrap",
		data: {
			user:{},//用来保存用户数据
		},
		methods:{
			//用户登录
			login(){
				//发送登录请求
				axios.post("http://localhost:8990/emsvue/user/login",this.user).then(res=>{
					console.log(res.data);
					if(res.data.state){
						alert(res.data.msg+",点击确定进入主页!");
						//将登录用户信息放入localStorage key  value,第二个参数,如果直接存放对象,浏览器无法解析,所以要转json
						localStorage.setItem("user",JSON.stringify(res.data.user));
						location.href="/emsvue/emplist.html";
					}else{
						alert(res.data.msg);
					}
				});
			}
		}
	});
</script>
